import { getMultiData, getGoodsData } from "../../service/index";

Page({

  /**
   * 页面的初始数据
   */
  data: {
    banners: [],
    recommends: [],
    titles: ['流行', '新款', '精选'],
    goodsTypes: ['pop', 'new', 'sell'],
    goods: {
      "pop": { page: 0, list: [] },
      "new": { page: 0, list: [] },
      "sell": { page: 0, list: [] },
    },
    currentType: "pop",
    showBackTop: false,
    isTabFixed: false,
    tabScrollTop: 0,
  },

  // ————事件监听函数————
  // 流行、新款、精选 标签页点击
  handleTabClick(event) {
    const index = event.detail.index;
    const type = this.data.goodsTypes;

    this.setData({
      currentType: type[index]
    })
    // console.log(this.data.currentType);
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {

    // 轮播图和推荐数据
    getMultiData().then(res => {
      const arrBanners = []
      res.data.data.banner.list.map((item) => {
        arrBanners.push(item.image)
      })
      const banners = arrBanners

      const recommends = res.data.data.recommend.list;
      this.setData({
        banners: banners,
        recommends: recommends
      })
    })

    // 商品推荐数据
    this._getGoodsData("pop");
    this._getGoodsData("new");
    this._getGoodsData("sell");
  },

  handleImage: function () {
    wx.createSelectorQuery().select("#tab-control").boundingClientRect(rect => {
      this.setData({
        tabScrollTop: rect.top
      })
    }).exec()
  },

  _getGoodsData(type) {
    // 获取页码
    const page = this.data.goods[type].page + 1

    getGoodsData(type, page).then(res => {
      const list = res.data.data.list;
      const oldList = this.data.goods[type].list;
      oldList.push(...list);

      // 将数据保存到data中
      const typeKey = `goods.${type}.list`;
      const pageKey = `goods.${type}.page`;
      this.setData({
        [typeKey]: oldList,
        [pageKey]: page
      })
    })
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    this._getGoodsData(this.data.currentType);
  },

  /**
 * 页面相关事件处理函数--监听页面滚动
 */
  onPageScroll: function (options) {
    const scrollTop = options.scrollTop;

    // 根据滚动位置自动显示 返回顶部组件
    const flag1 = scrollTop >= 100;
    if (flag1 !== this.data.showBackTop) {
      this.setData({
        showBackTop: flag1
      })
    }
    // 根据滚动位置自动使 tab-control 是否吸顶
    const flag2 = scrollTop >= this.data.tabScrollTop;
    if (flag2 != this.data.isTabFixed) {
      this.setData({
        isTabFixed: flag2
      });
    }

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})